<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" type="text/css" href="font-awesome-4.7.0/css/font-awesome.css">
    <title>Document</title>
    <style>
        html,
        body {
            padding: 0;
            margin: 0;
            font-size: 10px;
            background-color: white;
            font-family: "微软雅黑";
        }
        
        .header {
            background-color: #ccc;
            height: 3 rem;
            width: 100%;
        }
        
        .header .content {
            height: 3rem;
            line-height: 3rem;
            margin: 0 auto;
            width: 120rem;
        }
        
        .header .content span {
            height: 3rem;
            line-height: 3rem;
            display: block;
            float: left;
        }
        
        .header .content .location {
            float: left;
        }
        
        .header .content ul {
            list-style: none;
            float: right;
            width: 65rem;
            padding: 0;
            margin: 0;
        }
        
        .header .content ul li {
            float: left;
            width: 5.5rem;
        }
        
        .header .content ul li:first-child {
            float: left;
            width: 6rem;
            margin-left: 5rem;
            color: red;
        }
        
        b {
            border-right: 0.1rem solid #fff;
            height: 2.6rem;
            padding-left: 1rem;
        }
        
        .banner {
            position: relative;
            width: 100%;
            height: 8rem;
            background-image: url("images/topbanner.jpg");
            background-repeat: no-repeat;
            background-size: cover;
        }
        
        .close-btn {
            position: absolute;
            right: 10rem;
            top: 1rem;
            background-color: rgba(0, 0, 0, 0.2);
            padding: 0.4rem;
            width: 1.2rem;
            height: 1.2rem;
            text-align: center;
            color: white;
        }
        
        .search-box {
            position: relative;
            padding-top: 2rem;
            padding-bottom: 2rem;
        }
        
        .search-box .content {
            height: 6rem;
            line-height: 3rem;
            margin: 0 auto;
            width: 120rem;
        }
        
        .search-box .logo {
            background-image: url("images/logo.png");
            float: left;
            width: 27rem;
            height: 6rem;
        }
        
        .search-box .search {
            float: left;
            width: 60rem;
            height: 4rem;
        }
        
        .search-box .search input[type=text] {
            border: none;
            box-shadow: none;
            width: 39.5rem;
            height: 3.5rem;
            vertical-align: bottom;
            border: 0.25rem solid red;
            padding: 0;
        }
        
        .search-box .search input[type=text]+span {
            display: inline-block;
            color: white;
            font-size: 1.6rem;
            width: 10rem;
            height: 4rem;
            line-height: 4rem;
            text-align: center;
            margin: 0;
            padding: 0;
            vertical-align: bottom;
            background-color: red;
            margin-left: -1rem;
        }
        
        .search-box .hot-words {
            float: left;
            width: 40rem;
            height: 2rem;
        }
        
        .search-box .hot-words ul {
            margin: 0;
            padding: 0;
            list-style: none;
        }
        
        .search-box .hot-words ul li {
            float: left;
            padding-right: 2rem;
        }
        
        .search-box .hot-words ul li:first-child {
            color: red;
        }
        
        .search-box .car {
            position: absolute;
            width: 10rem;
            height: 4rem;
            right: 10rem;
            top: 2rem;
            border: 0.2rem solid #ccc;
            line-height: 3.5;
            padding-left: 3rem;
            text-align: center;
        }
        
        .tubiao {
            background-image: url(images/sprite.png);
            background-repeat: no-repeat;
            background-position: 0 -60px;
            width: 2rem;
            height: 2rem;
            position: absolute;
            top: 1rem;
            left: 1rem;
        }
        
        .number {
            background-color: red;
            border-radius: 70%;
            border-bottom-left-radius: 0;
            color: white;
            width: 1.5rem;
            height: 1.5rem;
            line-height: 1.5rem;
            text-align: center;
            position: absolute;
        }
        
        .nav {
            width: 100%;
            height: 5rem;
            border-bottom: 0.4rem solid red;
        }
        
        .nav ul {
            list-style: none;
            width: 120rem;
            margin: 0 auto;
            padding-left: 0rem;
        }
        
        .nav ul li {
            font-size: 2rem;
            height: 3rem;
            float: left;
            margin-left: 1rem;
            letter-spacing: 0.1rem;
            padding: 1.2rem;
            padding-top: 1.5rem;
            padding-bottom: 0.6rem;
        }
        
        .nav ul li.all {
            margin-left: -0.5rem;
            background-color: red;
            width: 15rem;
            height: 3rem;
            text-align: center;
            color: white;
        }
        
        .main {
            width: 100%;
            height: 30rem;
            background-image: url("images/banner.jpg");
            background-repeat: no-repeat;
            background-size: 192rem 60.3rem;
            background-position: center;
        }
        
        .main .content {
            width: 120rem;
            margin: 0 auto;
        }
        
        .main .content ul {
            margin: 0;
            padding: 0;
            list-style: none;
            width: 16.4rem;
            position: relative;
            margin-left: -0.5rem;
            float: left;
        }
        
        .main .content ul li {
            margin: 0;
            padding: 0;
            color: white;
            font-size: 1.4rem;
            height: 3rem;
            position: relative;
            background-color: red;
            padding-left: 1rem;
            width: 16.4rem;
        }
        
        .main .content ul li span {
            position: absolute;
            right: 0.5rem;
        }
        
        .main .content .image {
            float: left;
            width: 74.7rem;
            height: 41.1rem;
            margin-left: 3rem;
            margin-top: 0.5rem;
            position: relative;
        }
        
        .main .content .image img {
            width: 100%;
            height: 100%;
        }
        
        .main .content .image ul {
            position: absolute;
            bottom: 1rem;
            left: 50%;
            width: 15rem;
            margin-left: -10rem;
        }
        
        .main .content .image ul li {
            float: left;
            background-color: rgba(0, 0, 0, 0.4);
            color: white;
            text-align: center;
            width: 2.5rem;
            height: 2.5rem;
            border-radius: 50%;
            padding: 0;
        }
        
        .main .content .image .left-btn {
            width: 2rem;
            height: 4rem;
            background-color: rgba(0, 0, 0, 0.4);
            position: absolute;
            color: white;
            top: 50%;
            text-align: center;
            margin-top: -2rem;
            left: 0;
            font-size: 1.6rem;
            line-height: 4rem;
        }
        
        .main .content .image .right-btn {
            width: 2rem;
            height: 4rem;
            background-color: rgba(0, 0, 0, 0.4);
            position: absolute;
            color: white;
            top: 50%;
            text-align: center;
            margin-top: -2rem;
            right: 0;
            font-size: 1.6rem;
            line-height: 4rem;
        }
        
        .main .content .right-box {
            width: 24rem;
            margin: 0;
            padding: 0;
            float: left;
            margin-left: 1rem;
            border: 0.1rem solid #ccc;
            margin-top: 1rem;
        }
        
        .main .content .right-box .new-box {
            margin: 0;
            padding: 0;
            position: relative;
        }
        
        .main .content .right-box .new-box h1 {
            font-size: 1.5rem;
            float: left;
        }
        
        .main .content .right-box .new-box span {
            font-size: 1.5rem;
            float: left;
            position: absolute;
            right: 0;
            padding-top: 1rem;
        }
        
        .main .content .right-box ul {
            width: 24rem;
            height: 15rem;
            margin: 0;
            padding-left: 0.5rem;
        }
        
        .main .content .right-box ul li {
            color: black;
            background-color: white;
            font-size: 1.4rem;
            height: 2.4rem;
            padding-left: 1rem;
            width: 24rem;
            padding: 0;
        }
        
        .main .content .right-box .life-box table {
            margin-left: 1rem;
            border-collapse: collapse;
            margin-bottom: 1.6rem;
        }
        
        .main .content .right-box .life-box table td {
            border: 1px solid #ccc;
            width: 5rem;
            height: 5rem;
            text-align: center;
            position: relative;
        }
        
        .main .content .right-box .life-box table td b {
            display: block;
            width: 2rem;
            height: 2rem;
            background-image: url(images/sprite.png);
            background-repeat: no-repeat;
            background-position: 1.5rem -2.7rem;
        }
        
        .main .content .right-box .life-box table td span {
            position: absolute;
            bottom: 0.5rem;
            left: 1.5rem;
        }
        
        .activity {
            width: 100%;
            height: 16.5rem;
            float: left;
            margin: 0;
            padding: 0;
            padding-top: 0.8rem;
        }
        
        .activity .box1 {
            width: 23rem;
            height: 15.7rem;
            background-image: url(images/night.jpg);
            background-repeat: no-repeat;
            background-size: cover;
            margin-left: 7rem;
            position: relative;
            display: inline-block;
        }
        
        .activity .box2 {
            width: 24rem;
            height: 15.7rem;
            background-image: url(images/1.jpg);
            background-repeat: no-repeat;
            background-size: cover;
            position: absolute;
            margin-left: 0.2rem;
            display: inline-block;
        }
        
        .activity .box3 {
            width: 24rem;
            height: 15.7rem;
            background-image: url(images/2.jpg);
            background-repeat: no-repeat;
            background-size: cover;
            position: absolute;
            margin-left: 24.4rem;
            display: inline-block;
        }
        
        .activity .box4 {
            width: 24rem;
            height: 15.7rem;
            background-image: url(images/3.jpg);
            background-repeat: no-repeat;
            background-size: cover;
            position: absolute;
            margin-left: 48.6rem;
            display: inline-block;
        }
        
        .activity .box5 {
            width: 24rem;
            height: 15.7rem;
            background-image: url(images/4.jpg);
            background-repeat: no-repeat;
            background-size: cover;
            position: absolute;
            margin-left: 72.8rem;
            display: inline-block;
        }
        
        .mete {
            width: 100%;
            height: 7.36rem;
            margin: 0;
            padding: 0;
            background-color: ghostwhite;
            float: left;
        }
        
        .mete .slogen1 {
            width: 30rem;
            height: 7.36rem;
            background-image: url(images/slogen1.png);
            background-repeat: no-repeat;
            background-size: cover;
            position: relative;
            margin-left: 7rem;
            display: inline-block;
        }
        
        .mete .slogen2 {
            width: 30rem;
            height: 7.36rem;
            background-image: url(images/slogen2.png);
            background-repeat: no-repeat;
            background-size: cover;
            position: absolute;
            display: inline-block;
        }
        
        .mete .slogen3 {
            width: 30rem;
            height: 7.36rem;
            background-image: url(images/slogen3.png);
            background-repeat: no-repeat;
            background-size: cover;
            position: absolute;
            margin-left: 30rem;
            display: inline-block;
        }
        
        .mete .slogen4 {
            width: 30rem;
            height: 7.36rem;
            background-image: url(images/slogen4.png);
            background-repeat: no-repeat;
            background-size: cover;
            position: absolute;
            margin-left: 60rem;
            display: inline-block;
        }
        
        .foot {
            margin: 0;
            padding: 0;
            width: 120rem;
            height: 50rem;
            padding-top: 4rem;
            color: darkgray;
            margin-left: 10rem;
        }
        
        #service-2014 .slogen {
            position: relative;
            height: 5.4rem;
            padding: 2rem 0;
            margin-bottom: 2rem;
            background: #F5F5F5;
            text-align: center;
        }
        
        #service-2014 dt {
            padding: 0.6rem 0;
            font: 400 1.6rem/2.4rem;
        }
        
        #service-2014 dd {
            line-height: 2rem;
        }
        
        #service-2014 dl {
            float: left;
            width: 20rem;
        }
        
        #coverage {
            float: right;
            width: 30rem;
            height: 10rem;
            background-image: url(/images/china.png);
            background-repeat: no-repeat;
            background-size: cover;
        }
        
        #coverage .dt {
            padding: 0.6rem 4rem 1.5rem 8rem;
            font: 400 1.6rem/2.4rem;
        }
        
        #coverage .dd {
            padding: 0 4rem 1.5rem 80rem;
        }
        
        .clr {
            display: block;
            overflow: hidden;
            clear: both;
            height: 0;
            line-height: 0;
            font-size: 0;
        }
        
        .ar {
            text-align: right;
        }
        
        #service-2014 .fore5 {
            width: 100px;
        }
        
        .foot .china {
            position: absolute;
            margin-left: 85rem;
            width: 40rem;
            height: 40rem;
            padding-top: 4rem;
            background-image: url(images/china.png);
            background-repeat: no-repeat;
            background-position: -0.5rem -10.5rem;
            display: inline-block;
        }
        
        .foot .china h1 {
            font-size: 1rem;
        }
        
        .foot .china span {
            margin-left: 12rem;
        }
        
        #footer-2014 {
            border-top: 1px solid #E5E5E5;
            padding: 2rem 0 3rem;
            text-align: center;
        }
        
        #footer-2014 .links a {
            margin: 0 1rem;
        }
        
        #footer-2014 .copyright {
            margin: 1rem 0;
        }
        
        #footer-2014 .authentication a {
            margin: 0 5px;
            text-decoration: none;
        }
    </style>
</head>

<body>
    <div class="header">
        <div class="content">
            <div class="location">
                <span>送至:北京</span><span class="fa fa-angel-down"></span>
            </div>
            <ul>
                <li class="login">你好,请登录</li>
                <li>免费注册<b></b></li>
                <li>我的订单<b></b></li>
                <li>我的京东<b></b></li>
                <li>京东会员<b></b></li>
                <li>企业采购<b></b></li>
                <li>手机京东<b></b></li>
                <li>关注京东<b></b></li>
                <li>客户服务<b></b></li>
                <li>网页导航</li>
            </ul>

        </div>
    </div>
    <div class="banner">
        <div class="close-btn">
            X
        </div>
    </div>
    <div class="search-box">
        <div class="content">
            <div class="logo">
            </div>
            <div class="search">
                <input type="text">
                <span>搜索</span>
            </div>
            <div class="hot-words">
                <ul>
                    <li>热词1</li>
                    <li>热词2</li>
                    <li>热词3</li>
                    <li>热词4</li>
                    <li>热词5</li>
                    <li>热词6</li>
                </ul>

            </div>
            <div class="car">
                <div class="tubiao"></div>
                我的购物车 <span class="number">8</span>
            </div>

        </div>
    </div>
    <div class="nav">
        <ul>
            <li class="all">全部商品分类</li>
            <li>服装城</li>
            <li>美妆馆</li>
            <li>超市</li>
            <li>全球购</li>
            <li>闪购</li>
            <li>团购</li>
            <li>拍卖</li>
            <li>金融</li>
            <li>智能</li>
        </ul>

    </div>
    <div class="main">
        <div class="content">
            <ul>
                <li>家用电器<span>></span></li>
                <li>手机数码京东通信<span>></span></li>
                <li>家用电器<span>></span></li>
                <li>手机数码京东通信<span>></span></li>
                <li>家用电器<span>></span></li>
                <li>手机数码京东通信<span>></span></li>
                <li>家用电器<span>></span></li>
                <li>手机数码京东通信<span>></span></li>
                <li>家用电器<span>></span></li>
                <li>手机数码京东通信<span>></span></li>
                <li>家用电器<span>></span></li>
                <li>手机数码京东通信<span>></span></li>
                <li>家用电器<span>></span></li>
                <li>手机数码京东通信<span>></span></li>

            </ul>
            <div class="image">
                <img src="images/11.jpg"></img>
                <ul>
                    <li>1</li>
                    <li>2</li>
                    <li>3</li>
                    <li>4</li>
                    <li>5</li>
                    <li>6</li>
                </ul>
                <div class="left-btn">
                    &lt;</div>
                <div class="right-btn">&gt;</div>

            </div>
            <div class=right-box>
                <div class="new-box">
                    <h1>京东快报</h1>
                    <span>更多</span>
                </div>

                <ul>
                    <li>[特惠]1元秒杀</li>
                    <li>[公告]母婴类APP[京东宝宝]上线</li>
                    <li>[特惠]美的品牌日APP嗨购大放"价""</li>
                    <li>[公告]京东深入蒙牛生产基地进行质检</li>
                    <li>[特惠]白条购家电 24期免息!</li>
                </ul>
                <div class="life-box">
                    <div class="new-box2">
                        <h1>生活服务</h1>
                    </div>

                    <table>
                        <tr>
                            <td><b></b><span>话费</span></td>
                            <td><b></b><span>话费</span></td>
                            <td><b></b><span>话费</span></td>
                            <td><b></b><span>话费</span></td>
                        </tr>
                        <tr>
                            <td><b></b><span>话费</span></td>
                            <td><b></b><span>话费</span></td>
                            <td><b></b><span>话费</span></td>
                            <td><b></b><span>话费</span></td>
                        </tr>
                        <tr>
                            <td><b></b><span>话费</span></td>
                            <td><b></b><span>话费</span></td>
                            <td><b></b><span>话费</span></td>
                            <td><b></b><span>话费</span></td>
                        </tr>

                    </table>
                </div>

            </div>
        </div>
    </div>

    <div class="activity">
        <div class="box1"></div>
        <div class="box2"></div>
        <div class="box3"></div>
        <div class="box4"></div>
        <div class="box5"></div>
    </div>
    <div class="mete">
        <div class="slogen1"></div>
        <div class="slogen2"></div>
        <div class="slogen3"></div>
        <div class="slogen4"></div>
    </div>
    <div class="foot">
        <div id="service-2014">
            <div class="slogen">
                <img src="images/duo.png" alt="">
            </div>
            <div class="w">
                <dl class="fore1">
                    <dt>购物指南</dt>
                    <dd>
                        <div><a rel="nofollow" target="_blank" href="#">购物流程</a></div>
                        <div><a rel="nofollow" target="_blank" href="#">会员介绍</a></div>
                        <div><a rel="nofollow" target="_blank" href="#">生活旅行/团购</a></div>
                        <div><a rel="nofollow" target="_blank" href="#">常见问题</a></div>
                        <div><a rel="nofollow" target="_blank" href="#">大家电</a></div>
                        <div><a rel="nofollow" target="_blank" href="#">联系客服</a></div>
                    </dd>
                </dl>
                <dl class="fore2">
                    <dt>配送方式</dt>
                    <dd>
                        <div><a rel="nofollow" target="_blank" href="#">上门自提</a></div>
                        <div><a rel="nofollow" target="_blank" href="#">211限时达</a></div>
                        <div><a rel="nofollow" target="_blank" href="#">配送服务查询</a></div>
                        <div><a rel="nofollow" target="_blank" href="#">配送费收取标准</a></div>
                        <div><a target="_blank" href="#">海外配送</a></div>
                    </dd>
                </dl>
                <dl class="fore3">
                    <dt>支付方式</dt>
                    <dd>
                        <div><a rel="nofollow" target="_blank" href="#">货到付款</a></div>
                        <div><a rel="nofollow" target="_blank" href="#">在线支付</a></div>
                        <div><a rel="nofollow" target="_blank" href="#">分期付款</a></div>
                        <div><a rel="nofollow" target="_blank" href="#">邮局汇款</a></div>
                        <div><a rel="nofollow" target="_blank" href="#">公司转账</a></div>
                    </dd>
                </dl>
                <dl class="fore4">
                    <dt>售后服务</dt>
                    <dd>
                        <div><a rel="nofollow" target="_blank" href="#">售后政策</a></div>
                        <div><a rel="nofollow" target="_blank" href="#">价格保护</a></div>
                        <div><a rel="nofollow" target="_blank" href="#">退款说明</a></div>
                        <div><a rel="nofollow" target="_blank" href="#">返修/退换货</a></div>
                        <div><a rel="nofollow" target="_blank" href="#">取消订单</a></div>
                    </dd>
                </dl>
                <dl class="fore5">
                    <dt>特色服务</dt>
                    <dd>
                        <div><a target="_blank" href="#">夺宝岛</a></div>
                        <div><a target="_blank" href="#">DIY装机</a></div>
                        <div><a rel="nofollow" target="_blank" href="#">延保服务</a></div>
                        <div><a rel="nofollow" target="_blank" href="#">京东E卡</a></div>
                        <div><a rel="nofollow" target="_blank" href="#">京东通信</a></div>
                        <div><a rel="nofollow" target="_blank" href="#">京东JD+</a></div>
                    </dd>
                </dl>
                <div id="coverage">
                    <div class="dt">
                        京东自营覆盖区县
                    </div>
                    <div class="dd">
                        <p>京东已向全国2423个区县提供自营配送服务，支持货到付款、POS机刷卡和售后上门服务。</p>
                        <p class="ar"><a target="_blank" href="http://help.jd.com/user/issue/103-983.html">查看详情&nbsp;&gt;</a></p>
                    </div>
                </div>
                <span class="clr"></span>
                <div class="w">
                    <div id="footer-2014">
                        <div class="links">
                            <a rel="nofollow" target="_blank" href="#">关于我们</a>|<a href="#">联系我们</a>|<a rel="nofollow" target="_blank" href="#">商家入驻</a>|<a rel="nofollow" target="_blank" href="#">营销中心</a>|<a rel="nofollow" target="_blank" href="#">手机京东</a>|
                            <a target="_blank" href="#">友情链接</a>|<a target="_blank" href="#">销售联盟</a>|<a href="#" target="_blank">京东社区</a>|<a href="#" target="_blank">京东公益</a>|<a href="#" target="_blank">English Site</a>|<a href="#" target="_blank">Contact Us</a></div>
                        <div class="copyright">
                            <a target="_blank" href="#"><img src="images/abc.png"> 京公网安备 11000002000088号</a>&nbsp;&nbsp;|&nbsp;&nbsp;京ICP证070359号&nbsp;&nbsp;|&nbsp;&nbsp;<a target="_blank" href="#">互联网药品信息服务资格证编号(京)-经营性-2014-0008</a>&nbsp;&nbsp;|&nbsp;&nbsp;新出发京零&nbsp;字第大120007号<br>
                            <a rel="nofollow" href="#" target="_blank">音像制品经营许可证苏宿批005号</a>&nbsp;&nbsp;|&nbsp;&nbsp;出版物经营许可证编号新出发(苏)批字第N-012号&nbsp;&nbsp;|&nbsp;&nbsp;互联网出版许可证编号新出网证(京)字150号<br><a href="#" target="_blank">网络文化经营许可证京网文[2014]2148-348号</a>&nbsp;&nbsp;违法和不良信息举报电话：4006561155&nbsp;&nbsp;Copyright&nbsp;©&nbsp;2004-2016&nbsp;&nbsp;京东JD.com&nbsp;版权所有<br>京东旗下网站：
                            <a target="_blank" href="http://www.360top.com/">360TOP</a>&nbsp;&nbsp;<a href="#" target="_blank">拍拍网</a>&nbsp;&nbsp;<a href="#" target="_blank">网银在线</a></div>

                        <div class="authentication">
                            <a rel="nofollow" target="_blank" href="#">
                                <img width="103" height="32" alt="经营性网站备案中心" src="images/mess.png" class="err-product">
                            </a>

                            <a rel="nofollow" target="_blank" id="urlknet" tabindex="-1" href="#">
                                <img border="true" width="103" height="32" onclick="CNNIC_change('urlknet')" oncontextmenu="return false;" name="CNNIC_seal" alt="可信网站" src="images/mess2.png" class="err-product">
                            </a>
                            <a rel="nofollow" target="_blank" href="#">
                                <img width="103" height="32" alt="网络警察" src="images/mess3.png" class="err-product">
                            </a>
                            <a rel="nofollow" target="_blank" href="#">
                                <img width="103" height="32" src="images/mess4.png" class="err-product">
                            </a>
                            <a target="_blank" href="#"><img width="103" height="32" src="images/mess5.jpg"></a>
                            <a target="_blank" href="#"><img width="103" height="32" src="images/mess6.jpg"></a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>

</html>